/* eslint-disable max-len */
import { Graphics } from '../../../../src/scene/graphics/shared/Graphics';

import type { Container } from '../../../../src/scene/container/Container';
import type { TestScene } from '../../types';

export const scene: TestScene = {
    it: 'should render svg graphics paths',
    create: async (scene: Container) =>
    {
        const src = `
            <svg width="512" height="512" enable-background="new 0 0 512 512" viewBox="0 0 512 512" xmlns="http://www.w3.org/2000/svg">
                <path d="m0 0h512v512h-512z" fill="#272b34"/>
                <g fill="#ea1e63">
                    <-- dot -->
                    <path d="m177.1 222.4c8.2 0 13.5-5.6 13.5-12.5-.2-7.3-5.3-12.7-13.4-12.7s-13.4 5.4-13.2 12.7c-.1 6.9 5.2 12.5 13.1 12.5z"/>
                    <-- dot -->
                    <path d="m276.7 197.2c-8.1 0-13.4 5.4-13.2 12.7-.2 6.9 5.1 12.5 13 12.5 8.3 0 13.5-5.6 13.5-12.5-.1-7.3-5.2-12.7-13.3-12.7z"/>
                    <-- Pixi -->
                    <path d="m264.1 232.3h-22.6l-7.1 13c-2.1 4-4.1 8.1-6.3 12.4h-.3c-2.1-3.8-4.3-7.9-6.6-12l-7.9-13.4h-45.8c-.7-8.8-4.9-16.9-11.7-22.4-7.4-5.9-18.5-8.9-34-8.9-15.3 0-26.2 1-34 2.3v109.7h24.9v-39.8c2.8.4 5.7.5 8.6.5 14.9 0 27.6-3.6 36.1-11.7 3.2-3.1 5.7-6.8 7.3-10.9v61.9h47.4l7.6-14.5c2-4 4.1-7.9 6.1-12.2h.5c2 4.1 4 8.2 6.3 12.2l8.1 14.5h48.5v-80.7zm-143 22.1c-2.8.1-5.6-.1-8.4-.7v-32.8c3.4-.8 6.9-1.1 10.4-1 12.6 0 19.6 6.1 19.6 16.3 0 11.5-8.3 18.2-21.6 18.2zm68.8 50.8v-66.1l22.2 32.8zm52.3-34.4 21.9-31.7v66.2z"/>
                    <-- JS -->
                    <path d="m395.4 247c-14.4-5.4-20.6-8.6-20.6-15.7 0-5.8 5.3-10.7 16.2-10.7 8.1 0 16 1.8 23.3 5.3l5.6-20.3c-6.6-3-15.8-5.6-28.4-5.6-23.1 0-38.1 11.2-41.4 26.9v-25.1h-25.1v70c0 17.3-6.6 22.1-17.2 22.1-4.4 0-8.7-.7-12.9-2l-2.8 20.3c5.9 1.7 12.1 2.6 18.3 2.6 24.4 0 39.6-11.1 39.6-42.7v-32.3c2.8 12.6 13.9 21 29.9 26.5 13.4 4.8 18.6 8.7 18.6 15.7 0 7.3-6.1 12-17.7 12-9.7-.2-19.2-2.5-27.9-6.9l-5.1 20.8c6.3 3.5 18.8 6.8 31.5 6.8 30.5 0 44.9-15.8 44.9-34.5 0-15.7-9.2-25.9-28.8-33.2z"/>
                </g>
            </svg>`;

        const graphics = new Graphics().svg(src);

        graphics.width = 128;
        graphics.height = 128;

        scene.addChild(graphics);
    },
};
